<template>
  <div class="wrap" v-if="status !== 'nodata'">
    <u-loadmore class="main" :status="status" bg-color="#f8f8f8" @loadmore="loadmore">
  </div>
</template>

<script>
export default {
  props: {
    pageLoading: {}, // 是否加载中
    noMore: {}, // 是否没有更多数据了
    dataList: {}, // 列表数据
  },

  data() {
    return {};
  },

  computed: {
    status() {
      if (this.pageLoading) {
        return 'loading';
      }

      if (!this.pageLoading && this.noMore && this.dataList && this.dataList.length) {
        return 'nomore';
      }

      if (!this.pageLoading && !this.noMore && this.dataList && this.dataList.length) {
        return 'loadmore';
      }

      return 'nodata';
    },

    mounted() {},
    created() {},
    watch: {},
    methods: {
      loadmore() {
        this.$emit('loadmore');
      },
    },

    components: {},
  },
}
</script>

<style scoped lang="scss">
  .wrap {
    height: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
</style>
